<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8" name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <link rel="shortcut icon" href="../img/com/logo.png">
    <link rel="stylesheet" href="../asserts/css/normalize.css">
    <link rel="stylesheet" href="../css/style.css">
    <link rel="stylesheet" href="../css/pageCom.css">
    <link rel="stylesheet" href="../css/04_04superTables.css" />
    <style>
        html,body{
            font-family:'微软雅黑';
        }
        .fr{
            float: right;
        }
        .fr{
            float: right;
        }
        .main {
            flex: 1;
        }
        /*search 搜查框区域*/

        form {
            padding: 0.3rem 1rem;
            width: 57rem;
        }
        form select {
            position: relative;
            width: 9rem;
            background: transparent;
            border: 1px solid #00adef;
            z-index: 1001;
        }

        form label {
            display: inline-block;
            width: 6rem;
            text-align: right;
        }

        form input {
            width: 9rem;
            background: transparent;
            border:1px solid #00adef;
            border-radius: 3px;
        }
        .search .active{
            padding: 0.1rem 2rem;
            margin-left: 7.5rem;
        }
        .search{
            width: 100%;
            /*height: 17%;*/

        }

        #div_container{
            width: 100%;
            height: 85%;

        }

        /*table*/
        #score>th:not(.defen){
            color: #fffb8f;
            cursor: pointer;
        }

        #score>th:not(.defen):hover{
            color: orange;
        }
        tbody > tr:nth-of-type(odd) {
            background-color:transparent;
        }

        tbody > tr:nth-of-type(even) {
            background-color: transparent;
        }
        .center{
            color: #fff;
            background:transparent;
        }
        .red{
            color: #fffb8f;
            text-align: left;
        }
        .red ~ td{
            color:#fffb8f;
        }
        .left{
            text-align: left;
        }
        .myOptionBox{
            position: relative;
            z-index: 6;
        }
        select{
            text-transform: none;
            width: 100%;
            height: 100%;
            background: transparent;
            border:.1rem solid var(--themeBlue)
        }
        input{
            text-transform: none;
            width: 100%;
            height: 100%;
            background: transparent;
            border-radius: 0.2rem;
            border:.1rem solid var(--themeBlue);
            text-align: center;
        }
        .search .active{
            position: relative;
            right:0;
            padding: 0.1rem 2.5rem;
        }



    </style>
</head>
<body id="07_01jiekuanrentianbao" data-title="借款人填报">
<div class="container">
    <div class="main">
        <div class="chartBox ec002">
            <div class="chartTitle">
                <h3>平台总览表</h3>
            </div>
            <div class="search">
                <form action="">
                    <div class="inputGroup">
                        <label >平台名称：</label>
                        <select class="inp">
                            <option value=""></option>
                            <option value="">鲁金所</option>
                            <option value="">鲁金所1</option>
                            <option value="">鲁金所2</option>
                            <option value="">鲁金所3</option>
                            <option value="">鲁金所4</option>
                        </select>
                    </div>
                    <div class="inputGroup">
                        <div class="btnGroup search">
                            <button class="active" id="search" type="button">提交</button>
                        </div>
                    </div>
                </form>
            </div>
            <!--表格-->
            <div id="div_container" style="text-align:center;position:relative;">
                <!-- 固定表头 table外层必须包有一个div  id="my_div"   class="fakeContainer first_div" 引入superTables.js  在页面下面还需要调用 -->
                <div style="height:100%;width: 100%;" id="my_div" class="fakeContainer first_div" >
                    <table border="1" id="demoTable" style="border-collapse: collapse;">
                        <tr id="my_tr">
                            <th class="center" rowspan="2">借款方</th>
                            <th class="center" rowspan="2">资料类别</th>
                            <th class="center" rowspan="1">主要信息</th>
                            <th class="center" rowspan="1">鲁金所</th>
                        </tr>
                        <tr id="score">
                            <th class="center defen">得分</th>
                            <th class="center">
                                <input type="text">
                            </th>

                        </tr>
                        <tr>
                            <td class="center ziranren" rowspan="26">自然人</td>
                            <td class="center" rowspan="9">基础信息</td>
                            <td class="center red" id="userName">姓名</td>
                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>
                        <tr>
                            <td class="center red" id="idCard">身份证</td>
                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>


                        </tr>
                        <tr>
                            <td class="center red" id="purpose">借款用途</td>
                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>
                        </tr>
                        <tr>
                            <td class="center left" id="sex">性别</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>
                        <tr>
                            <td class="center left" id="userAge">年龄</td>
                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>
                        <tr>
                            <td class="center left" id="education">学历</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center left">婚姻状况</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center left">户籍所在地</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center left">还款来源</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>
                        <tr>
                            <td class="center" rowspan="7">信用信息</td>

                            <td class="center red">在平台逾期次数</td>
                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center red">在平台的逾期金额</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center red">征信报告近6个月逾期情况</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center red" >在其他平台有无借款</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center left">历史借款笔数</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center left">历史借款总额</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center left">增信措施</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center" rowspan="5">资产信息</td>

                            <td class="center left">收入情况</td>
                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center left">有无购房</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center left">有无购车</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center left">有无房贷</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center left">有无车贷</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center" rowspan="5">工作信息</td>

                            <td class="center red">从事行业</td>
                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>


                        </tr>

                        <tr>
                            <td class="center left">工作城市</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>
                        </tr>

                        <tr>
                            <td class="center left">公司规模</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center left">工作岗位</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center left">工作年限</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>
                        <!-- 企业 -->
                        <tr>
                            <td class="center jiekuanfang" rowspan="17">企业</td>

                            <td class="center" rowspan="9">基本信息</td>
                            <td class="center red">公司名称</td>
                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>


                        </tr>
                        <tr>
                            <td class="center red">法定代表人</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center red">成立时间</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center red">注册资本</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center red">注册地址</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center red">营业范围</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center left">公司规模</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center red">资金用途</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center red">还款来源</td>

                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>

                        <tr>
                            <td class="center" rowspan="8">其他信息</td>

                            <td class="center red">借款企业收入情况</td>
                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>


                        </tr>
                        <tr>
                            <td class="center red">借款人企业负债情况</td>
                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>
                        <tr>
                            <td class="center red">借款人借款前6个月征信报告</td>
                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>
                        <tr>
                            <td class="center red">借款人是否在其他平台借款</td>
                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>
                        <tr>
                            <td class="center left">股东信息</td>
                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>
                        <tr>
                            <td class="center left">法人信用信息</td>
                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>
                        <tr>
                            <td class="center left">增信措施</td>
                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>
                        <tr>
                            <td class="center left">涉诉信息</td>
                            <td class="center">
                                <select class="inp">
                                    <option value=""></option>
                                    <option value="">√</option>
                                    <option value="">×</option>
                                </select>
                            </td>

                        </tr>
                    </table>
                </div>
            </div>

        </div>
    </div>
</div>

<script src="../asserts/js/echarts-4.0.js"></script>
<script src="../asserts/js/jquery-2.2.4.js"></script>
<script src="../js/main.js"></script>
<script src="../js/chartsCom.js"></script>
<script type="text/javascript" src="../js/04_04superTables.js"></script>

</body>
</html>

<script type="text/javascript">



    //此处调用superTables.js里需要的函数
    $(document).ready(function(){
        // window.onload=function(){
        new superTable("demoTable", {cssSkin : "sDefault",
            fixedCols : 2, //固定几列
            headerRows :2,  //头部固定行数
            onStart : function () {
                this.start = new Date();
            },
            onFinish : function () {
            }
        });
        $("#div_container").css("width","100%");//这个宽度是容器宽度，不同容器宽度不同
        $(".fakeContainer").css("height","100%");//这个高度是整个table可视区域的高度，不同情况高度不同

        //.sData是调用superTables.js之后页面自己生成的  这块就是出现滚动条 达成锁定表头和列的效果
        $(".sData").css("width","100%");//这块的宽度是用$("#div_container")的宽度减去锁定的列的宽度
        $(".sData").css("height","100%");//这块的高度是用$("#div_container")的高度减去锁定的表头的高度

        //目前谷歌  ie8+  360浏览器均没问题  有些细小的东西要根据项目需求改

        //有兼容问题的话可以在下面判断浏览器的方法里写
        if(navigator.appName == "Microsoft Internet Explorer" && navigator.appVersion.match(/9./i)=="9.")
        {//alert("IE 9.0");

        }else if (!!window.ActiveXObject || "ActiveXObject" in window){//alert("IE 10");

        }else{//其他浏览器
            //alert("其他浏览器");
        }
        //模块框
        $("#score>th:not(.defen)").click(function () {
            $('#model').css('display','block');
        });
        $(".del a").click(function () {
            $('#model').css('display','none');
        });
    });






</script>
